{#继承父模板#}
{% extends 'common/base.html' %}

{% load staticfiles %}

{#标题#}
{% block title %}满分餐厅｜满分菜品{% endblock title %}

{# 头部js #}
{% block head_js %}
    <script src="{% static 'js/one_dish.js' %}"></script>
{% endblock head_js %}

{#页面主体#}
{% block body %}
	<div class="main">

		<div class="topics">
            {% if dish.dish_type_id == 4 %}
                <div class="container">满分饮品</div>
            {% else %}
                <div class="container">满分菜品</div>
            {% endif %}
		</div>

		<div class="single">
			<div class="container">

				<h3>{{ dish.dish_name }}</h3>

				<div class="story-con">
					<img class="single_img img-responsive" src="{% static dish.dish_img %}" alt="" />
					
					<p>{{ dish.dish_desc | safe}}</p>
				</div>

				<div class="links">
					<ul>
                        <li class="praise_li"><a class="dish_praise" href="javascript:"><span class="praise_response_pic glyphicon glyphicon-thumbs-up"></span><span class="dish_praise_num">{{ dish.dish_praise }}</span></a></li>
						<li><a class="show_response" href="javascript:"><span class="praise_response_pic glyphicon glyphicon-envelope"></span><span class="all_response_link">所有评论</span> (<span class="response_num">{{ dish.dish_response }}</span>)</a></li>
					</ul>
				</div>



{#                所有评论#}
                <ul class="response_con">
                    {% for response in dish_responses %}
                        <li class="user_response">
                            <span class="response_user_pic glyphicon glyphicon-user"></span>
                            <span class="response_name">{{ response.user_name }}：</span>
                            <span class="response_desc">{{ response.response }}</span>
                            <br>
                            <time class="response_time">{{ response.update_time }}</time>
                        </li>
                    {% endfor %}
                        <input type="hidden" class="response_flag">
                </ul>

                <div class="show_more_response">
                    <a href="javascript:">查看更多</a>
                </div>

                <div class="no_response_tip">没有评论了哦，快来添加点评吧！</div>

				<div class="comments-area">
					<h2>点评：</h2>
					<form method="post" action="javascript:">
						{% csrf_token %}
                        {#菜品id#}
                        <input type="hidden" class="dish_id" name="dish_id" value="{{ dish.id }}">

                        <p>
							<label>姓名</label>
							<span>*</span>
							<input name="user_name" class="user_name" type="text" value="">
						</p>

                        <p>
                            <div class="error_tip error_name">错误提示</div>
                            <div class="error_tip_python">{{ mess.error_name }}</div>
                        </p>

						<p>
							<label>点评</label>
							<span>*</span>
							<textarea name="response" class="response"></textarea>
						</p>

						<p>
                            <div class="error_tip error_msg">错误提示</div>
                            <div class="error_tip_python">{{ mess.error_msg }}</div>
                            <input class="submit_btn" type="submit" value="提交点评">
                        </p>

					</form>
				</div>

			</div>
		</div>
	</div>

    {#    评论成功，弹框提示#}
    <div class="container">
    <div class="pop_main row" id="pop">
        <div class="pop_con col-lg-4 col-lg-offset-4 col-md-6 col-md-offset-2 col-sm-10 col-sm-offset-1 col-xs-10 col-xs-offset-1">

            <div class="pop_title">×</div>

            <div class="pop_detail">
                <p class="pop_text">
                    评论成功！<br>
                    欢迎来品尝，美味一直都在 ^ ^
                </p>
            </div>

            <div class="pop_footer">
                还有<span id="count">5</span>秒自动关闭弹框
            </div>

        </div>
        <div class="mask"></div>
    </div>
    </div>

{% endblock body %}
